import {PlIcon, PlRoot} from "plain-ui";
import 'plain-ui/dist/plain-ui.min.css'
import './PublicRoot.scss'
import './initialize/index'
import {initWin} from "../doc/data";
import {App, designComponent} from "plain-ui-composition";
import "@/doc/home/theme/ThemeEditPanel";

initWin()

PlIcon.registry('plicon-', icon => {
    return (
        <svg class="plicon" aria-hidden="true">
            <use xlinkHref={`#${icon}`}/>
        </svg>
    )
})
PlIcon.registry('pli-', icon => {
    return <i class={`pl-icon-font ${icon}`}/>
})

export const PublicApp = designComponent({
    slots: ['default'],
    setup({slots}) {
        return () => (
            <PlRoot>
                {slots.default()}
            </PlRoot>
        )
    },
})

export function processApplication(app: App) {
    app.mixin({
        computed: {
            console() {
                return window.console
            },
        },
    })
}
